import React,{Suspense} from 'react'
import routes from './routerConfig'
import {BrowserRouter,Routes,Route,Navigate} from 'react-router-dom'

function RouterView() {
  const renderRouter =(arr)=>{
    return arr.map((item,index)=>{
        return item.path ? <Route key={index} path={item.path} element={<item.element></item.element>}>
            {
                item.children && renderRouter(item.children)
            }
        </Route>:
        <Route key={index} path={item.from} element={<Navigate to={item.to}></Navigate>}></Route>
    })
  }  
  return (
    <Suspense fallback={'路由加载中'}>
        <BrowserRouter>
            <Routes>
                {renderRouter(routes)}
            </Routes>
        </BrowserRouter>
    </Suspense>
  )
}

export default RouterView